<template>
    <div class="messageBox">
        <slot />
    </div>
</template>

<script setup lang="ts">
import { reactive, ref, computed, watch, onMounted } from 'vue';
import { useRouter, useRoute } from 'vue-router';
</script>

<style lang="scss" scoped>
.messageBox {
    position: relative;
    width: 168px;
    word-wrap: break-word;
    min-height: 48px;
    box-sizing: border-box;
    padding: 8px;
    border-radius: 6px;
    background: #fff;
    &::after {
        content: '';
        position: absolute;
        left: -8px;
        top: 8px;
        width: 0;
        height: 0;
        border-top: 5px solid transparent;
        border-right: 10px solid #fff;
        border-bottom: 5px solid transparent;
    }
}
</style>
